<template>
	<view class="qr-page">
		<img src="@/static/images/img_1.png" class="bg" alt="" />
		<image show-menu-by-longpress="true" class="qrCode" :src="qrCode" mode="widthFix"></image>
	</view>
</template>

<script>
export default {
	data() {
		return {
			qrCode: ''
		}
	},
	async onLoad(options) {
		this.qrCode = ''
		await this.$nextTick()
		const url = `${options.qrCode}?t=${new Date().getTime()}`
		this.qrCode = url
	}
}
</script>

<style lang="scss" scoped>
.qr-page {
	width: 100%;
	min-height: 100vh;
	background: linear-gradient(0deg, #e6eaff, #adc4ff);
	padding: 35rpx 15rpx 35rpx;
	box-sizing: border-box;
	position: relative;
	.bg {
		width: 720rpx;
		height: 1176rpx;
		display: block;
	}
	.qrCode {
		width: 256rpx;
		height: 256rpx;
		position: absolute;
		top: 178rpx;
		left: 50%;
		transform: translate(-50%, 0);
	}
}
</style>
